<template>
	<view class="Content">

		<!-- header -->
		<header>
			<view class="header-title">
				<text>九阵智慧医院平台</text>
			</view>
		</header>
		
		<main>
			<view class="main-img">
				<image src="../../static/logo/Nielogo.png" mode=""></image>
				<text>欢迎使用</text>
	
				<!-- button -->
				 <!-- <router-link :to="{ path: '../../' }">手机登录</router-link> -->
		<u-button type="primary" @click="login()"> 手机登录 </u-button>
		<u-button type="success" @click="login()"> 微信登录 </u-button>

			<uni-popup ref="popup" type="message">
				<uni-popup-message type="error" message="失败" :duration="2000"></uni-popup-message>
			</uni-popup>
			<!-- error -->
			<uni-popup ref="popupsuccess" type="message">
				<uni-popup-message type="success" message="登录成功" :duration="2000"></uni-popup-message>
			</uni-popup>
				<!-- <button @click='login()'>手机登录</button>
				<button @click='login()'>微信登录</button> -->
			</view>
		</main>
		
		
		<!-- footer -->
		<footer>
			<view class="footer-information">
				<u-checkbox-group>
					<u-checkbox @change='isno' v-model="checked" shape="square"></u-checkbox>
				</u-checkbox-group>
			<text>我已阅读并同意balala。。。。。。。。。</text>
			</view>
		</footer>
		
	</view>
	
</template>

<script>
	export default {
		data() {
			return {
				checked: false,
			};
		},
		methods:{
			isno(e){
				this.checked = e
			},
			login(){
			if(this.checked == false){
				this.$refs.popup.open()
			}else{
				this.$refs.popupsuccess.open()
				uni.switchTab({
					url:'/pages/index/index'
				})
			}
			},
		}
	}
</script>

<style lang="scss">
	.Content{
		height: 100%;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		background-color: #fff;
		header{
			display: flex;
			align-items: center;
			height: 60px;
			.header-title{
					text-align: center;
				text{
					font-size: 16px;
				}
			}
		}
		
		// main
		main{
			.main-img{
				display: flex;
				flex-direction: column;
				align-items: center;
				margin-top: 50px;
				image{
					width: 80px;
					height: 80px;
					border-radius: 50%;
				}
				text{
					margin-top: 10px;
					font-size: 16px;
					font-weight: 300;
				}
				::v-deep.el-button{
					margin: 8px;
					border-radius: 20px;
					width: 120px;
					height: 26px;
					line-height:0;
					font-size: 10px;
					background-color: aquamarine;
				}
			
			}
		}
		// footer
		footer{
			  display: flex;
			  position: fixed;
			  align-items: center;
			  right: 0;
			  left: 0;
			  bottom: 0;
			  height: 49px;
			  justify-content: center;
				flex: 1;
				width: 100%;
				}
			.footer-information{
				display: flex;
				align-items: center;
				padding: 8px;
				text{
					font-size: 10px;
					padding-left: 10px;
				}
			}
	}
</style>
